<template>
  <view class="login-wrapper">
    <view class="login-content">
      <view class="login-pic">
        <u--image
          src="/static/login/login-pic@2x.png"
          width="100%"
          mode="widthFix"
          height="auto"></u--image>
      </view>
      <view class="login-form">
        <maya-login-btn />
        <!-- <view class="flex-center checkbox-box">
          <u-checkbox-group v-model="protocol">
            <u-checkbox
              :size="30"
              :name="true"
            >
            </u-checkbox>
          </u-checkbox-group>
          <view class="flex align-center">我已阅读并同意
            <u-link
              text="《用户协议》"
              @click="click"></u-link>和
            <u-link
              text="《隐私协议》"
              @click="click"></u-link>
          </view>
        </view> -->
      </view>
    </view>
  </view>
</template>

<script>
import mayaLoginBtn from '@/components/maya-login-btn.vue';
import storage from '../../utils/storage';
export default {
  components: {
    mayaLoginBtn,
  },
  data() {
    return {
      protocol: false,
    };
  },
  mounted() {
    // 清除登录相关缓存
    storage.clearLoginStorage();
  },
  methods: {
    // 看协议
    protocolChange() {
			
    },
  },
};
</script>

<style lang="scss">
.login-wrapper{
	height: 100vh;
	position: relative;
	background: linear-gradient(#8de871 0, #fff 60%);
	.login-bg{
		position: absolute;
		width: 100%;
		left:0;
		top: 0;
	}
	.login-content{
		flex-direction: column;
		align-items: center;
		.login-pic{
			margin: 0 auto;
			display: block;
			width: 70%;
			padding: 10% 0 0 0;
		}
	}
	.login-form{
		padding-top: 10%;
		.checkbox-box{
			padding-top: 50rpx;
		}
	}
}
</style>
